<template>
	<view class="content">
		<page-head title="请您留下遇到的问题或提出宝贵的建议"></page-head>
		<form @submit="formSubmit" @reset="formReset">
			<view class="uni-common-mt">
				<view class="uni-form-item uni-column">
					<view class="title"><text class="requiedF">*</text>称呼</view>
					<input class="uni-input" name="nick" placeholder="请输入您的称呼" />
				</view>
				<view class="uni-form-item uni-column">
					<view class="title"><text class="requiedF">*</text>手机<text class="textDesc">(与邮箱必填一个)</text></view>
					<input class="uni-input" name="phone" placeholder="请输入您的手机" />
				</view>
				<view class="uni-form-item uni-column">
					<view class="title">邮箱</view>
					<input class="uni-input" name="email" placeholder="请输入您的邮箱" />
				</view>
				<view class="uni-form-item uni-column">
					<view class="title"><text class="requiedF">*</text>问题描述</view>
					<view class="uni-textarea">
						<textarea @blur="bindTextAreaBlur" auto-height style="min-height: 50px;" placeholder="请输入您的问题描述" name="content" />
					</view>
			</view>
		</view>
		<view class="uni-btn-v">
			<button form-type="submit" type='primary'>提交</button>
			<button type="default" form-type="reset">重置</button>
		</view>
		</form>
		<hvl-contact />
	</view>
</template>
<style>
	.requiedF {
		color: #FF3333;
	}
	.textDesc{
		color:#666666;
		font-size: 14px;
	}
</style>
<script>
	var graceChecker = require('common/graceChecker.js');
	import mInput from '../../components/m-input.vue'
	import hvlContact from '../../components/hvl-contact.vue'
	export default {
		components: {
			mInput,
			hvlContact
		},
		data() {
			return {}
		},
		methods: {
			formSubmit: function(e) {
				//进行表单检查
				var formData = e.detail.value;
				if (!formData.nick) {
					uni.showToast({
						title: '请填写称呼',
						icon: "none"
					});
					return ;
				}
				if(!formData.phone && !formData.email) {
					uni.showToast({
						title: '手机与邮箱必填一个',
						icon: "none"
					});
					return;
				}
				const emailReg = /^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/;
				if (formData.email && !emailReg.test(formData.email)) {
					uni.showToast({
						icon: 'none',
						title: '邮箱地址不合法'
					});
					return;
				}
				if (formData.phone && !(/^1[34578]\d{9}$/.test(formData.phone))) {
					uni.showToast({
						icon: 'none',
						title: '手机号格式不合法'
					});
					return;
				}
				if (!formData.content) {
					uni.showToast({
						title: '请填写问题描述',
						icon: "none"
					});
					return;
				}
				
				uniCloud.callFunction({
					name: 'company_suggest_submit',
					data: formData
				}).then((res) => {
					uni.hideLoading()
					
					uni.showModal({
						content: `提交成功`,
						showCancel: false
					})
				}).catch((err) => {
					uni.hideLoading()
					uni.showModal({
						content: `添加数据失败，错误信息为：${err.message}`,
						showCancel: false
					})
					console.error(err)
				})
			},
			formReset: function(e) {
				console.log('清空数据')
			}
		}
	}
</script>
